<template>
	<ShowContentVue 
		:textContent="TextContent" 
		@btnEvent="register" 
		@textEvent="toLogin" 
		:userFormData="form" 
	/>
</template>

<script setup>
	import ShowContentVue from '../../components/ShowContent.vue';
	import {
		useUserStore
	} from '../../store'
	import {
		ref,
		reactive
	} from 'vue';
	const TextContent = reactive({
		btnText: '立即注册',
		text: '已有账号？去登录',
		welcome: '您好,一键注册!',
		placeHolderText: {
			fText: '账号',
			sText: '密码',
			isShowCode: true
		},
		placeHolderStyle: {
			color: '#FB7685',
			paddingRight: '48rpx'
		}
	})	
	const userStore = useUserStore()
	const form = reactive({
		password: "",
		phone: ""
	})
	const register = async ({checkedAgree}) => {
		if(!checkedAgree.value) {
			uni.showToast({
				title: '请选择同意协议'
			})
			return
		}
		if(form.password === "" || form.phone === "") {
			uni.showToast({
				title: '用户名密码为空'
			})
			return
		}
		const res = await userStore.userRegister({
			...form
		})
		if(res?.code == 0 || res?.code == "10016") {
			uni.showToast({
				title: res?.code == 0 ? "注册成功" : res?.message || '已有账号,去登陆',
				duration: 2000,
			})
			setTimeout(function () {
				uni.hideToast();
				uni.navigateTo({
					url: "/pages/login/index"
				})
			}, 2000);
		} else if(res?.code === '-1') {
			uni.showToast({
				message: res?.message,
			})
		}
	} 
	
	//注册
	const toLogin = () => {
		console.log('注册');
		uni.navigateTo({
			url: "/pages/login/index"
		})
	}
</script>

<style scoped lang="scss">
	::v-deep .u-input__content__field-wrapper__field {
		padding: 10rpx 0 10rpx 30rpx;
		color: #CCCCCC;
	}
</style>